<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui">

    <h:head>
        <title>Account Activation</title>
    </h:head>
    <h:body>
        <h:form>
            <div id="top">
                <h:graphicImage url="/image/newHeader.jpg"/> 
            </div>
       

            <div id="content">
                <table>

                    <tr>

                        <td style="vertical-align: top">
                            <p:toolbar style="font-size:80%;height:33px;width:207px"> 
                                <p:toolbarGroup align="right">
                                    <p:button title="Home" image="ui-icon-home" outcome="index2"/>
                                    <p:button title="Notes" image="ui-icon-note"/>
                                    <p:button title="Mail" outcome="messages" image="ui-icon-mail-closed"/>     
                                    <p:button title="Edit Preferences" image="ui-icon-gear"/>
                                    <p:button title="Help" image="ui-icon-help"/>
                                    <p:button title="Logout" image="ui-icon-close" outcome="index2"/> 
                                </p:toolbarGroup>
                            </p:toolbar>

                            <p:menu style="width:201px; height:310px; font-family: Tahoma;border-style: double;">  
                                <p:submenu label="Admin Department">  
                                    <p:menuitem value="Home" url="http://localhost:8080/MerlionERP-war/userManagement/AdminDeptWorkspace.xhtml" ajax="false" icon="ui-icon ui-icon-home"/>  
                                </p:submenu>  
                            </p:menu>
                            <p:calendar mode="inline" style="font-size:11px;font-family:Tahoma"/>

                        </td>
                        <td>
                            <h:graphicImage value="activation.jpeg" style="width:75px;height:35px" />
                            <h:outputText value="         "/>
                            <h:outputText value="Activation Page"  style="font-family:Tahoma;font-size:20px;font-weight:bolder"/>
                            <p:spacer width="100" height="10"/>

                            <p:panel id="panel" style="width:1122px; height:472px;">
                                <h:panelGrid columns="4">             

                                    <h:outputText value="Email "/>
                                    <h:outputText value=":"/>
                                    <p:inputText id="email" validator="#{UserManagedBean.validateEmail}" value="#{UserManagedBean.email}" required="true" requiredMessage="Email is required"/>
                                    <p:message for="email"/>

                                    <h:outputText value="Security Question: "/>
                                    <h:outputText value=":"/>
                                    <p:inputText id="sq" value="#{UserManagedBean.securityQuestion}" required="true" requiredMessage="Security Question is required"/>
                                    <p:message for="sq"/>

                                    <h:outputText value="Security Answer: "/>
                                    <h:outputText value=":"/>
                                    <p:inputText id="sa" value="#{UserManagedBean.securityAnswer}" required="true" requiredMessage="Security Answer is required"/>
                                    <p:message for="sa"/>

                                    <p:captcha label="Captcha" theme="white" id="captcha" requiredMessage="Captcha must be filled"/>
                                    <h:outputText value=""/>
                                    <p:message for="captcha"/>
                                    <h:outputText value=""/>

                                    <p:commandButton value="Activate" ajax="false" update="panel" actionListener="#{UserManagedBean.doActivate}" /><br/>                  
                                </h:panelGrid>
                            </p:panel>
                        </td>
                    </tr>
                </table>
            </div>

            <div id="footer">
                <h:graphicImage url="/image/merlionfooter.jpg"/> 
            </div>
            <p:ajaxStatus style="width:16px;height:16px;">  
                <f:facet name="start">  
                    <h:graphicImage value="../design/ajaxloading.gif" />  
                </f:facet>  

                <f:facet name="complete">  
                    <h:outputText value="" />  
                </f:facet>  
            </p:ajaxStatus>
        </h:form>
    </h:body>
</html>
